<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="perm" uri="/WEB-INF/tld/perm.tld"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<script>
	var ctx = '${ctx}'
</script>
<style>
/*profile*/
.user-heading {
	border-radius: 4px 4px 0 0;
	-webkit-border-radius: 4px 4px 0 0;
	text-align: center;
}

.user-heading img {
	width: 112px;
	height: 112px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	border: 10px solid rgba(255, 255, 255, 0.3);
	display: inline-block;
}

.user-heading h1 {
	font-size: 22px;
	font-weight: 300;
	margin-bottom: 5px;
}

.user-heading p {
	font-size: 12px;
}

</style>
<form id="myFormImage" enctype="multipart/form-data" target="hidden_frame" method="post" class="form-horizontal" role="form">
	<input id="user-id" value="${sysUser.id}"  type="hidden" />
	<div class="user-heading">
		<input type="file" class="file-pos" id="user-avatar" name="imageFile" style="display: none;">
		<img id="myImageFile" src="${sysUser.image}" alt="">
	</div>
	<div class="form-group" >
		<label for="phone" class="col-md-2 control-label">手机:<span class='red-check'>*</span>: </label>
		<div class="col-md-10">
			<input type="text" value="${sysUser.phone}" class="form-control" id="phone" name="phone" data-check="require:true">
		</div>
	</div>
	<div class="form-group">
		<label  class="col-md-2 control-label">用户名<span class='red-check'>*</span>:</label>
		<div class="col-md-10">
			<input type="username" class="form-control" id="username" value="${sysUser.username}" name="username" data-check="require:true">
		</div>
	</div>
	<div class="form-group">
		<label  class="col-md-2 control-label">昵称<span class='red-check'>*</span>:</label>
		<div class="col-md-10">
			<input type="fullname" class="form-control" id="fullname" value="${sysUser.fullname}" name="fullname" data-check="require:true">
		</div>
	</div>
	<div class="form-group">
		<label  class="col-md-2 control-label">部门:</label>
		<div class="col-md-10">
			<input class="form-control" value="${sysUser.dept}" disabled="">
		</div>
	</div>
	<div class="form-group">
		<label  class="col-md-2 control-label">角色:</label>
		<div class="col-md-10">
			<input class="form-control" value="${sysUser.roles}" disabled="">
		</div>
	</div>
	<div class="form-group">
		<label  class="col-md-2 control-label">性别:</label>
		<div class="col-md-10">
        	<div class="form-inline" >
	        	<div class="checkbox i-checks">
	                 <label><input type="radio"  name="gender" id="gender_famale" value="1" <c:if test="${sysUser.gender==1}">checked=""</c:if>> <i></i>男</label>
	             </div>
	             <div class="checkbox i-checks">
	                 <label><input type="radio"  name="gender" id="gender_male" value="2" <c:if test="${sysUser.gender==2}">checked=""</c:if>> <i></i>女</label>
	             </div>
            </div>
		</div>
	</div>
</form>
<iframe style="display: none" name='hidden_frame' id="hidden_frame"></iframe>
<script type="text/javascript">

	$(function() {
		
		$("#phone").change(function() {
			var myreg = /^1[3458]\d{9}$/;
			var mo = $("#phone").val();
			if (!myreg.exec(mo)) {
				alert('请输入正确的手机号');
			}
		});

		$('#myImageFile').click(function() {
			$("#user-avatar").click();
		});
		
		$('#user-avatar').change(function(){
			$("#myFormImage").attr("target", "hidden_frame");
			var name = $("#user-avatar").val().split(".");
			var imageName = name[name.length - 1];
			if (imageName != "gif" && imageName != "GIF"
					&& imageName != "jpg" && imageName != "JPG"
					&& imageName != "JPEG" && imageName != "JPEG"
					&& imageName != "png" && imageName != "PNG") {
				$.notify("温馨提示", "图片必须为gif,jpeg,jpg,png格式");
				return;
			}
			var action = $("#myFormImage").attr("action");
			$("#myFormImage").attr("action", ctx + "/file/iframeUploadTwo");
			document.getElementById("myFormImage").submit();
			$("#myFormImage").attr("action", action);
			$("#myFormImage").attr("target", "");
		});
	})
	function imageCallback(message, success) {
		if (success == false) {
			$.notify("温馨提示", "图片必须为gif,jpeg,jpg,png格式");
		} else {
			var url = decodeURIComponent(message);
			console.log("url["+url);
			$("#myFormImage").append('<input name="imageUrl" type="hidden" value="'+url+'"/></td>');
			$("#myImageFile").attr("src", url);
		}
	}
	
	 $(function(){
		 $('input').iCheck('destroy');
		 $(".i-checks").iCheck({checkboxClass:"icheckbox_square-green",radioClass:"iradio_square-green"});	 
	 })
	
</script>